<template>
<div>
    <Card :bordered="false" dis-hover>
        <div class="g_header_nav">
            <div class="g_header_t">
                <div class="operate-btns">
                    <a class="fbtn iconfont icon-head-add" href="javascript:;" @click='add(true)'>新增</a>
                    <!-- <a class="fbtn iconfont icon-head-release" href="javascript:;" @click=''>批量发布</a> -->
                </div>
            </div>
            <div class="con_breadcrumb">
                <ol class="breadcrumb">
                    <li>
                        <a href="#">需求发布列表</a>
                    </li>
                </ol>
                <h3 class="current_module">需求发布列表</h3>
            </div>
        </div>
        <div class="content">
            <!-- 查询 -->
            <div class="group_search layui-form">
                <div class="row">
                    <div class="col-md-4 col-lg-4">
                        <input type="email" class="form-control" placeholder="仓库位置" v-model='search.Venue' name="name" style="background: #ebebeb;">
                    </div>
                    <div class="col-md-4 col-lg-4">
                        <div class="text-input bg-gray displayflex">
                            <span class="flexitem">租赁价格</span>
                            <div class="flex1">
                                <input type="text" class="text-center" placeholder="" name="price" v-model="search.minLeasingPrice">
                            </div>
                            <i>-</i>
                            <div class="flex1">
                                <input type="text" class="text-center" placeholder="" name="price" v-model="search.maxLeasingPrice">
                            </div>
                            <i class="flexitem">元/㎡/月</i>
                        </div>
                    </div>
                    <div class="col-md-4 col-lg-4" v-show="false">
                        <div class="check_group">
                            <label class="label">营运状态</label>
                            <input type="hidden" name="radio">
                            <div class="control-filtering ">
                                <a id="all_state" class="option " value="1" @click='search.BizState=""' :class='{"active":search.BizState==""}'>全部</a>

                                <a id="y_state" class="option " value="2" @click='search.BizState="Y"' :class='{"active":search.BizState=="Y"}'>有效</a>

                                <a id="y_state" class="option " value="2" @click='search.BizState="S"' :class='{"active":search.BizState=="S"}'>停用</a>

                                <a id="s_state" class="option " value="3" @click='search.BizState="E"' :class='{"active":search.BizState=="E"}'>作废</a>
                            </div>
                        </div>
                    </div>
                    <div class="col-md-4 col-lg-4">
                        <div class="check_group">
                            <label class="label">发布状态</label>
                            <input type="hidden" name="radio">
                            <div class="control-filtering ">
                                <a id="all_state" class="option" value="" @click='search.IsPublish=""' :class='{"active":search.IsPublish==""}'>全部</a>
                                <a id="y_state" class="option " value="Y" @click='search.IsPublish="Y"' :class='{"active":search.IsPublish=="Y"}'>已发布</a>
                                <a id="s_state" class="option " value="N" @click='search.IsPublish="N"' :class='{"active":search.IsPublish=="N"}'>未发布</a>
                            </div>
                        </div>
                    </div>
                </div>
                <div class="row">
                    <div class="col-md-7 col-lg-7">
                        <div class="check_group">
                            <label class="label">仓库类型</label>
                            <input type="hidden" name="radio">
                            <div class="control-filtering ">
                                <a id="all_state" class="option" value="1" @click='search.WareHouseType=""' :class='{"active":search.WareHouseType==""}'>全部</a>
                                <a id="y_state" class="option " value="2" @click='search.WareHouseType="01"' :class='{"active":search.WareHouseType=="01"}'>平库</a>
                                <a id="s_state" class="option " value="3" @click='search.WareHouseType="02"' :class='{"active":search.WareHouseType=="02"}'>高台库</a>
                                <a id="s_state" class="option " value="4" @click='search.WareHouseType="03"' :class='{"active":search.WareHouseType=="03"}'>楼库</a>
                                <a id="s_state" class="option " value="5" @click='search.WareHouseType="04"' :class='{"active":search.WareHouseType=="04"}'>地下仓库</a>
                                <a id="s_state" class="option " value="6" @click='search.WareHouseType="05"' :class='{"active":search.WareHouseType=="05"}'>立体库</a>
                                <a id="s_state" class="option " value="7" @click='search.WareHouseType="06"' :class='{"active":search.WareHouseType=="06"}'>坡道库</a>
                                <a id="s_state" class="option " value="8" @click='search.WareHouseType="07"' :class='{"active":search.WareHouseType=="07"}'>气体库</a>
                            </div>
                        </div>
                    </div>
                    <div class="col-md-1 col-lg-1 text-right fr">
                        <button type="button" class="btn btn-def" @click='getData'>
                            <span class="iconfont icon-search" aria-hidden="true"></span>
                            查询
                        </button>
                    </div>
                </div>
            </div>
            <!-- 查询 end -->
            <div class="content-tit">
                <h2 class="h2_1 fl" style='font-size:100%;'>
                    当前共<span id="id_num">{{search.total}}</span>条记录
                </h2>
            </div>
            <table class="table table-route" id="test-table">
                <thead>
                    <tr>
                        <!-- <th>
                            <label class="icon-checkbox">
                                <input type="checkbox"> 
                                <span>序号</span>
                            </label>
                        </th> -->
                        <th>序号</th>
                        <th>仓库位置</th>
                        <th>预计租期</th>
                        <th>仓库类型</th>
                        <th>仓库面积</th>
                        <th>货物范围</th>
                        <th>联系人/联系电话</th>
                        <th>租赁价格</th>
                        <th>发布状态</th>
                        <th>操作</th>
                    </tr>
                </thead>
                <tbody>
                    <tr v-for='(item,index) in list'>
                        <!-- <td>
                            <label class="icon-checkbox">
                                <input type="checkbox"> 
                                <span>{{index+1}}</span>
                            </label>
                        </td> -->
                        <td>{{index+1}}</td>
                        <td>{{item.Venue}}</td>
                        <td>{{item.PlanLeasePeriod}}</td>
                        <td>{{item.WareHouseType | WareHouseType}}</td>
                        <td>{{item.TotalAreaAge}}㎡</td>
                        <td>{{item.GoodsCategory | GoodsCategory}}</td>
                        <td>{{item.Contacts}} {{item.ContactTel}}</td>
                        <td>
                            <b class="w-red">{{item.LeasingPrice}}</b>元/天/㎡
                        </td>
                        <td>{{item.IsPublish=='Y'?'已发布':'未发布'}}</td>
                        <td>
                            <div class="from-button">
                                <a class="green-button" @click='add(false, item.GUID)'>编辑</a>
                                <a class="red-button" @click="remove(item.GUID)">删除</a>
                            </div>
                        </td>
                    </tr>
                </tbody>
            </table>
            <Page show-total :page-size="search.PageSize" :current="search.PageIndex" :total="search.total" @on-change="changePage"></Page>
        </div>
    </Card>
</div>
</template>

<script>
export default {
    data() {
        return {
            list: [],
            search: {
                NeedLogOn: true,
                Province: "410000",
                Venue: "",
                WareHouseType: "",
                minLeasingPrice: "",
                maxLeasingPrice: "",
                PageIndex: 1,
                PageSize: 10,
                total: 0,
                page: 1,
                IsPublish: ""
            },
            disabled: false,
            datas: '',
        };
    },
    mounted() {},
    methods: {
        getData() {
            var self = this;

            this.axios.post("/api/requirement/search", this.search).then(function(res) {
                self.list = res.datas;
                self.search.total = res.total;
            });
        },
        changePage(pageNum) {
            this.search.PageIndex = pageNum;
            this.getData();
        },
        add(falg, guid) {
            var self = this;
            if (falg) {
                this.$router.push(`/front/demandEditDetail/${falg}/00`);
            } else {
                this.$router.push(`/front/demandEditDetail/${falg}/${guid}`);
            }
        },
        remove: function(guid) {
            const self = this;

            this.$Modal.confirm({
                title: "警告",
                closable: false,
                content: "是否确定删除？",
                onOk: () => {
                    self.axios.post("/api/requirement/delete", {Guid: guid}).then(res => {
                        if (res.success) {
                            self.$Notice.success({
                                title: "提示",
                                desc: "删除成功！"
                            });
                            self.getData();
                        } else {
                            self.$Notice.error({
                                title: "提示",
                                desc: "删除失败，请稍后重试！"
                            });
                        }
                    });
                }
            });
        },
        venue(val, txt) {
            this.item.Venue = txt.map(c => c.label).join("/");
            this.item.Province = val[0];
            this.item.City = val[1];
        },
    },
    created() {
        this.getData();
    },
    activated() {
        this.getData();
    }
};
</script>


